import Vue from 'vue'
import Vuex from 'vuex'
// 引入vuex日志插件,打印vuex state,方便调试
import createLogger from 'vuex/dist/logger'

Vue.use(Vuex)

const store = new Vuex.Store({
  state: {
    // 小程序启动时，storage=>vuex
    cart: wx.getStorageSync('cart') || []
  },
  getters: {
    getCart (state) {
      return state.cart
    }
  },
  mutations: {
    // 订单生成后,删除已经勾选的商品
    arrangeCart (state) {
      // 过滤掉已经勾选的商品
      state.cart = state.cart.filter(item => {
        return !item.checked
      })
    },
    // 购物车页面商品选中状态及数量变更
    updateCart (state, goodsList) {
      // goodsList构造一个cart,设置到storage
      state.cart = goodsList.map(item => {
        return {
          goodsId: item.goodsId,
          num: item.num,
          checked: item.checked
        }
      })
    },
    // 加入购物车
    add2Cart (state, goodsId) {
      // 取
      let cart = state.cart
      // 更新
      // 需要区分是否是第一次
      // find方法会遍历数组，每一项执行指定函数，如果返回值为true的话，遍历中断，返回这一项
      let targetGoods = cart.find(item => {
        return item.goodsId === goodsId
      })
      if (targetGoods) {
        // 非首次
        // targetGoods是引用，是地址
        targetGoods.checked = true
        targetGoods.num = targetGoods.num + 1
      } else {
        // 首次,保证顺序，当前添加插到前面
        let newGoods = {
          goodsId,
          num: 1,
          checked: true
        }
        state.cart = [newGoods, ...cart]
      }
    }
  },
  plugins: [createLogger()]
})

export default store
